<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="redux.min.js" type="text/javascript"></script>
</head>
<body>
<div>
    <p>
        Clicked: <span id="value">0</span> times
        <button id="add">+</button>
        <button id="del">-</button>
        <button id="incrementIfOdd">Increment if odd</button>
        <button id="incrementAsync">Increment async</button>
    </p>
</div>
<script>
    function reducer(state, action) {
        if (typeof state == 'undefined') {
            return 0;
        }

        switch (action.type) {
            case 'ADD':
                return state + 1;
                break;
            case 'DEL':
                return state - 1;
                break;
        }
    }

    var store = Redux.createStore(reducer);
    var valEL = document.getElementById('value');

    function render() {
        valEL.innerHTML = store.getState().toString();
    }
    render()
    store.subscribe(render)

    document.getElementById('add').addEventListener('click',function(){
        store.dispatch({type:'ADD'})
    },false)
    document.getElementById('del').addEventListener('click',function(){
        store.dispatch({type:'DEL'})
    },false)


</script>
</body>
</html>
